<template>
  <div>
    <span>{{formatTime(timer)}}</span>
    <el-button type="primary" @click="zd" v-bind:disabled="disa">开始作答</el-button>
  <el-button type="danger" @click="se">返回</el-button>
    <el-button type="primary" @click="submit">交卷</el-button>
  <el-table
      ref="filterTable"
      :data="tableData"
      border
      style="width: 100%">
<!--      @selection-change="handleSelectionChange"-->

    <el-table-column
        type="index"
        label="题目编号" width="80px">
    </el-table-column>
    <el-table-column
        prop="question"
        label="题目">
    </el-table-column>

    <el-table-column
        prop="optionA"
        label="A选项">
    </el-table-column>

    <el-table-column
        prop="optionB"
        label="B选项">
    </el-table-column>

    <el-table-column
        prop="optionC"
        label="C选项">
    </el-table-column>

    <el-table-column
        prop="optionD"
        label="D选项">
    </el-table-column>

    <el-table-column label="选择答案">
      <template slot-scope="scope">
      <el-select v-model="ans[scope.$index].da">
        <el-option label="A" value="A"></el-option>
        <el-option label="B" value="B"></el-option>
        <el-option label="C" value="C"></el-option>
        <el-option label="D" value="D"></el-option>
      </el-select>
      </template>
    </el-table-column>

  </el-table>
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "Doque",
  data(){
    return{
      tableData:[],
      qs:[],
      multipleSelection:[],
      stuan:[],
      ans:[],
      disa:false,
      timer: 0,
      uid:'',
      eid:'',
      score:{},
    }
  },
  methods:{
    submit(){
      if(confirm("确认要交卷吗？")){

      for(var i in this.ans){
        this.stuan[i].da=this.ans[i].da
        if(this.ans[i].answer==this.ans[i].da){
          this.ans[i].bool=0
        }else{
          this.ans[i].bool=1
        }
      }
      let fenshu=0;
      for(var j in this.ans){
        if(this.ans[j].bool==0){
          fenshu+=1;
        }
      }
      this.eid=JSON.parse(window.sessionStorage.getItem("eid"))
      this.score={eid:this.eid,uid:this.uid,score:fenshu};
      console.log(this.score)
      axios.post("/question/addscore",this.score).then(resp=>{
        if(resp.data.flag){
          this.$router.push("/exams");
          this.$message.success(resp.data.message);
          alert("你答对了"+fenshu+"道题，用了"+this.timer+"秒")
        }
      })
      axios.post("/question/addstuan",this.stuan).then(resp=>{
        if(resp.data.flag){
          this.$message.success(resp.data.message);
        }
      })
      }
    },
    zd(){
      this.bc()
      this.disa=true;
      setInterval(() => {
        this.timer++;
      }, 1000);
    },
    formatTime(time) {
      // 将时间格式化为 hh:mm:ss 的形式
      let hour = Math.floor(time / 3600);
      let minute = Math.floor((time - hour * 3600) / 60);
      let second = Math.floor(time - hour * 3600 - minute * 60);
      return `${hour.toString().padStart(2, '0')}:${minute
          .toString()
          .padStart(2, '0')}:${second.toString().padStart(2, '0')}`;
    },
    bc(){
      for(var i in this.qs){
        this.stuan.push({qid:this.qs[i].qid,answer:'',uid:this.uid})
        this.ans.push({answer:this.qs[i].answer,da:'',bool:''})
      }
    },
    se(){
      if(confirm("确认要返回吗？本次答题将不记录分数")){
        this.$router.push("/exams")
      }
    },
    findAll(){
      this.uid=JSON.parse(window.sessionStorage.getItem("user")).uid
      axios.get("/question/questions").then(resp =>{
        this.tableData=resp.data.data;
        this.qs=resp.data.data;
      })
    },
  },
  created() {
    this.findAll()
  }
}
</script>

<style scoped>
</style>